草庐IT

2D 地图绘制

全部标签

javascript - Fabric.js - 自由绘制矩形

我有以下不能正常工作的:varcanvas=newfabric.Canvas('canvas');canvas.observe('mouse:down',function(e){mousedown(e);});canvas.observe('mouse:move',function(e){mousemove(e);});canvas.observe('mouse:up',function(e){mouseup(e);});varstarted=false;varx=0;vary=0;/*Mousedown*/functionmousedown(e){varmouse=canvas.ge

javascript - 绑定(bind)谷歌将自动完成放在文本框上而不实例化谷歌地图

我正在尝试在我的网站上添加GooglePlacesAutocomplete。我在不使用实例化谷歌地图的情况下将我的搜索文本框与自动完成绑定(bind)时遇到问题。我想做的是,我想在我的搜索字段中使用自动完成作为文本建议。但遗憾的是,我看到的所有教程都将自动完成功能与谷歌地图一起使用。有什么办法解决这个问题吗?提前致谢。 最佳答案 伙计们,你们可以使用下面的代码。varautocomplete;functioninitialize(){autocomplete=newgoogle.maps.places.Autocomplete(/*

javascript - .gif 标记谷歌地图

我的代码里有这个varmap;functioninitialize(){varmapDiv=document.getElementById('map-canvas');map=newgoogle.maps.Map(mapDiv,{center:newgoogle.maps.LatLng(37.4419,-122.1419),zoom:13,mapTypeId:google.maps.MapTypeId.ROADMAP});google.maps.event.addListenerOnce(map,'tilesloaded',addMarkers);}functionaddMarkers

javascript - 谷歌地图标记标签文本颜色更改

我正在尝试将Googlemap标记标签颜色更改为白色,同时将鼠标悬停在事件上。如何更改标签颜色。我的代码是functionhover(id){varicon2="";for(vari=0;i 最佳答案 最简单的方法是为每个标记创建mouseover/mouseout事件处理程序以更新标签文本颜色。//createsamarkerwithaclosurefortheeventfunctions.functioncreateMarker(latLng,text,label){varmarker=newgoogle.maps.Marker

javascript - 谷歌地图 V3 捕捉到最近的街道

当我点击map时,我希望标记与最近的街道对齐。这里有一个很好的例子:http://econym.org.uk/gmap/example_snappath.htm(主页:http://econym.org.uk/gmap/snap.htm)。但是-这个例子是针对谷歌地图版本2的。有没有办法在v3中做到这一点? 最佳答案 您给出的示例通过进行方向查找然后从中获取第一个位置来获取结果。在apiv3中,这是通过以下代码完成的,其中“map”是您的map的名称vardirectionsService=newgoogle.maps.Direct

javascript - 动画谷歌地图折线

我想在谷歌地图中绘制一条动画(测地线)折线,有点像这样:http://planefinder.net/route/SFO/我找到了许多关于如何沿多段线为符号设置动画的教程,但没有关于如何为多段线本身从源到目的地设置动画的教程。有什么提示吗?我应该从哪里开始?非常感谢任何帮助。 最佳答案 我在以下方面取得了一些成功:vardeparture=newgoogle.maps.LatLng(dept_lat,dept_lng);//Settowhateverlat/lngyouneedforyourdeparturelocationvara

javascript - 关闭所有信息窗口谷歌地图 API V3?

如何让所有信息窗口在单击另一个图钉或单击map本身时关闭?我正在使用http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html和一个kml叠加层。到目前为止,这是我的JS:jQuery(document).ready(function($){functioninitialize(){google.maps.visualRefresh=true;varmyLatlng=newgoogle.maps.LatLng(51.201465,-0.30244);varmapOp

javascript - 无法使用 D3 使路径绘制缓慢增长

使用d3图形库,我似乎无法让路径绘制缓慢,因此可以看到它们在增长。Thissite在“折线图(展开)”部分有一个完美的例子,但没有给出该部分的代码。有人可以帮助我了解可以实现这一目标的D3代码行吗?当我尝试附加delay()或duration()时,例如在以下代码片段中,路径仍然立即绘制,并且该段之后的所有SVG代码都无法呈现。varmpath=svg.append('path');mpath.attr('d','M3548L2248L2235L2222L3522L3535L4835L4848').attr('fill','none').attr('stroke','blue').du

javascript - 如何预加载谷歌地图的某些部分?

我正在使用GoogleMapsAPI构建一个网络应用程序,我需要平滑地放大一个区域,所以我使用setTimeout每秒增加缩放级别,但在某些网络不好的地方,map图像加载速度太慢以至于页面很快变成白页....所以我的问题是是否可以预加载Googlemap的某些部分(从3点缩放到16点) 最佳答案 您可以将其预加载到隐藏的div或iframe中。但你应该确保它不违反GoogleMaps/GoogleEarthAPIsTermsofService10.1.3RestrictionsagainstDataExportorCopying.(

javascript - 使用 ajax 数据和响应式绘制 Chart.js。几个问题和疑问

我正在使用Chart.js(http://www.chartjs.org/docs/)制作图表。我需要从Ajax请求和图表中获取数据以进行响应。在我的HTML代码中,我添加了一个Canvas,如下所示:在我的javascript(JQuery)代码中我有:vardata2;$.ajax({url:$('#userscreated').data('url'),async:true,dataType:'json',type:"get",}).done(function(data){data2=data;//Drawchartvarcontext=$('#userscreated').get